<template>
    <section>
        <!--工具条-->
        <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
            <el-form :inline="true" :model="query">
                <el-form-item>
                    <el-input v-model="query.keyword" placeholder="请输入关键字"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" v-on:click="search">查询</el-button>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="handleAdd">新增</el-button>
                </el-form-item>
              <el-form-item>
                <el-button type="success" @click="onsale">上架</el-button>
              </el-form-item>
              <el-form-item>
                <el-button type="warning" @click="offsale">下架</el-button>
              </el-form-item>
            </el-form>
        </el-col>

        <!--列表-->
        <el-table :data="pageInfo.rows" highlight-current-row v-loading="listLoading" @selection-change="selsChange"
                  style="width: 100%;">
            <el-table-column type="selection" width="55">
            </el-table-column>
            <el-table-column type="index" width="60" fixed>
            </el-table-column>
            <el-table-column prop="title" fixed label="标题" width="120" sortable>
            </el-table-column>
            <el-table-column prop="saleprice" fixed label="原价" width="80" sortable>
            </el-table-column>
            <el-table-column prop="costprice" fixed label="售价" width="80" sortable>
            </el-table-column>
            <el-table-column prop="isnew" label="是否新车" width="180" sortable>
                <template scope="scope">
                    <span v-if="scope.row.isnew=='1'" style="color: green">是</span>
                    <span v-if="scope.row.isnew=='0'" style="color: red">否</span>
                </template>
            </el-table-column>
            <el-table-column prop="reigstertime" label="上牌时间" width="180" sortable>
            </el-table-column>
            <el-table-column prop="mileage" label="行驶里程" width="180" sortable>
            </el-table-column>
            <el-table-column prop="shopname" label="店铺名称" width="180" sortable>
            </el-table-column>
            <el-table-column prop="createtime" label="创建时间" width="180" sortable>
            </el-table-column>
            <el-table-column prop="onsaletime" label="上架时间" width="180" sortable>
            </el-table-column>
            <el-table-column prop="offsaletime" label="下架时间" width="180" sortable>
            </el-table-column>
            <el-table-column prop="state" label="状态" width="100" sortable>
                <template scope="scope">
                    <span v-if="scope.row.state=='1'" style="color: green">上架</span>
                    <span v-if="scope.row.state=='0'" style="color: red">下架</span>
                </template>
            </el-table-column>
            <el-table-column prop="costeffective" label="是否超值" width="80" sortable>
                <template scope="scope">
                    <span v-if="scope.row.costeffective=='1'" style="color: green">是</span>
                    <span v-if="scope.row.costeffective=='0'" style="color: red">否</span>
                </template>
            </el-table-column>
            <el-table-column prop="rushsale" label="是否急售" width="80" sortable>
                <template scope="scope">
                    <span v-if="scope.row.rushsale=='1'" style="color: green">是</span>
                    <span v-if="scope.row.rushsale=='0'" style="color: red">否</span>
                </template>
            </el-table-column>
            <el-table-column prop="quasinewcar" label="是否准新车" width="80" sortable>
                <template scope="scope">
                    <span v-if="scope.row.quasinewcar=='1'" style="color: green">是</span>
                    <span v-if="scope.row.quasinewcar=='0'" style="color: red">否</span>
                </template>
            </el-table-column>
            <el-table-column prop="transitivecountry" label="是否可迁全国" width="80" sortable>
                <template scope="scope">
                    <span v-if="scope.row.transitivecountry=='1'" style="color: green">是</span>
                    <span v-if="scope.row.transitivecountry=='0'" style="color: red">否</span>
                </template>
            </el-table-column>
            <el-table-column prop="typeId" label="车辆类型" width="180" sortable>
            </el-table-column>
            <el-table-column prop="carId" label="所在店铺" width="180" sortable>
            </el-table-column>
            <el-table-column prop="sellerId" label="卖方" width="180" sortable>
            </el-table-column>
            <el-table-column prop="userId" label="用户" width="100" sortable>
            </el-table-column>
            <el-table-column prop="searchMasterMsgId" label="寻主消息" width="100" sortable>
            </el-table-column>
            <!--0待审核  1通过审核  -1审核失败-->
            <el-table-column prop="auditstate" label="审核状态" width="90" sortable>
                <template scope="scope">
                    <span v-if="scope.row.auditstate=='0'" style="color: blue">待审核</span>
                    <span v-if="scope.row.auditstate=='1'" style="color: green">审核通过</span>
                    <span v-if="scope.row.auditstate=='-1'" style="color: red">审核失败</span>
                  <el-button size="small" @click="submitCheck(scope.$index, scope.row)">提交审核</el-button>
                </template>
            </el-table-column>
            <el-table-column fixed="right" label="操作" width="450" align="center">
                <template scope="scope">
                    <el-button size="small" @click="autoAudit(scope.$index, scope.row)">审核</el-button>
                  <el-button size="small" @click="handleAudit(scope.$index, scope.row)">人工审核</el-button>
                    <el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                    <el-button size="small" @click="handleCarResource(scope.$index, scope.row)">资源维护</el-button>
                    <el-button size="small" @click="handleCardetect(scope.$index, scope.row)">检测维护</el-button>
                    <el-button size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--工具条-->
        <el-col :span="24" class="toolbar">
            <el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>
            <el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="query.pageSize"
                           :total="pageInfo.total" style="float:right;">
            </el-pagination>
        </el-col>

        <!--新增或编辑界面

        :visible.sync="outerVisible" 新版本打开对话框
        v-model="carFormVisible" 老版本打开对话框
        -->
        <el-dialog title="新增或编辑" :visible.sync="carFormVisible" :close-on-click-modal="false">
            <el-form :model="car" label-width="80px" :rules="carFormRules" ref="carForm">

                <el-form-item label="标题" prop="title">
                    <el-input v-model="car.title" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="封面" prop="cover">
                    <el-upload
                            class="upload-demo"
                            action="http://localhost:80/fastDfs/"
                            :on-preview="handlePreview"
                            :on-remove="handleRemove"
                            :on-success="handleSuccess"
                            :file-list="fileList"
                            list-type="picture">
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
                </el-form-item>
                <el-form-item label="原价" prop="saleprice">
                    <el-input v-model="car.saleprice" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="折扣价" prop="costprice">
                    <el-input v-model="car.costprice" auto-complete="off"></el-input>
                </el-form-item>

                <el-form-item label="类型">
                    <el-cascader v-model="car.carType"
                                 :options="carTypes"
                                 :props="{
							   checkStrictly: true,
							   label:'name',
							   value:'id'
							}"
                                 clearable></el-cascader>
                </el-form-item>
                <el-form-item label="新车">
                    <el-radio-group v-model="car.isnew">
                        <el-radio class="radio" :label="1">是</el-radio>
                        <el-radio class="radio" :label="0">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="上牌时间">
                    <el-date-picker
                            value-format="yyyy-MM-dd"
                            v-model="car.reigstertime"
                            type="date"
                            placeholder="选择日期">
                    </el-date-picker>
                </el-form-item>

                <el-form-item label="里程" prop="mileage">
                    <el-input v-model="car.mileage" auto-complete="off"></el-input>
                </el-form-item>

                <el-form-item label="超值">
                    <el-radio-group v-model="car.costeffective">
                        <el-radio class="radio" :label="1">是</el-radio>
                        <el-radio class="radio" :label="0">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="急售">
                    <el-radio-group v-model="car.rushsale">
                        <el-radio class="radio" :label="1">是</el-radio>
                        <el-radio class="radio" :label="0">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="准新车">
                    <el-radio-group v-model="car.quasinewcar">
                        <el-radio class="radio" :label="1">是</el-radio>
                        <el-radio class="radio" :label="0">否</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="全国可迁">
                    <el-radio-group v-model="car.transitivecountry">
                        <el-radio class="radio" :label="1">是</el-radio>
                        <el-radio class="radio" :label="0">否</el-radio>
                    </el-radio-group>
                </el-form-item>

                <el-form-item label="基本信息">
                    <quill-editor v-model="car.carDetail.info" :options="quillOption">
                    </quill-editor>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="carFormVisible = false">取消</el-button>
                <el-button type="primary" @click.native="save" :loading="carLoading">提交</el-button>
            </div>
        </el-dialog>
        <el-dialog title="资源维护" :visible.sync="carResourceFormVisible" :close-on-click-modal="false">
            <el-form :model="carResource" label-width="80px"  ref="carResourceForm">

                <el-form-item label="主图" prop="img">
                    <el-upload
                            class="upload-demo"
                            action="http://localhost:80/fastDfs/"
                            :on-preview="carResourceImgHandlePreview"
                            :on-remove="carResourceImgHandleRemove"
                            :on-success="carResourceImgHandleSuccess"
                            :file-list="carResourceImgFileList"
                            list-type="picture">
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
                </el-form-item>
                <el-form-item label="副图" prop="viceimg">
                    <el-upload
                            class="upload-demo"
                            action="http://localhost:80/fastDfs/"
                            :on-preview="carResourceViceImgHandlePreview"
                            :on-remove="carResourceViceImgHandleRemove"
                            :on-success="carResourceViceImgHandleSuccess"
                            :file-list="carResourceViceImgFileList"
                            list-type="picture">
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
                </el-form-item>
                <el-form-item label="更多图" prop="moreimg">
                    <el-upload
                            class="upload-demo"
                            action="http://localhost:80/fastDfs/"
                            :on-preview="carResourceMoreImgHandlePreview"
                            :on-remove="carResourceMoreImgHandleRemove"
                            :on-success="carResourceMoreImgHandleSuccess"
                            :file-list="carResourceMoreImgFileList"
                            list-type="picture">
                        <el-button size="small" type="primary">点击上传</el-button>
                        <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="carResourceFormVisible = false">取消</el-button>
                <el-button type="primary" @click.native="resourceSubmit" :loading="carResourceLoading">提交</el-button>
            </div>
        </el-dialog>


        <!--审核界面

        :visible.sync="outerVisible" 新版本打开对话框
        v-model="carFormVisible" 老版本打开对话框
        -->
        <el-dialog title="人工审核" :visible.sync="auditFormVisible" :close-on-click-modal="false">
            <el-form :model="car" label-width="80px" :rules="auditFormRules" ref="auditForm">
                <el-form-item label="标题" prop="title">
                  <el-input v-model="car.title" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="封面" prop="cover">
                  <el-upload
                      class="upload-demo"
                      action="http://localhost:80/fastDfs/"
                      :on-preview="handlePreview"
                      :on-remove="handleRemove"
                      :on-success="handleSuccess"
                      :file-list="fileList"
                      list-type="picture">
                    <el-button size="small" type="primary">点击上传</el-button>
                    <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
                  </el-upload>
                </el-form-item>
                <el-form-item label="原价" prop="saleprice">
                  <el-input v-model="car.saleprice" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="折扣价" prop="costprice">
                  <el-input v-model="car.costprice" auto-complete="off"></el-input>
                </el-form-item>

                <el-form-item label="类型">
                  <el-cascader v-model="car.carType"
                               :options="carTypes"
                               :props="{
                     checkStrictly: true,
                     label:'name',
                     value:'id'
                  }"
                               clearable></el-cascader>
                </el-form-item>
                <el-form-item label="新车">
                  <el-radio-group v-model="car.isnew">
                    <el-radio class="radio" :label="1">是</el-radio>
                    <el-radio class="radio" :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="上牌时间">
                  <el-date-picker
                      value-format="yyyy-MM-dd"
                      v-model="car.reigstertime"
                      type="date"
                      placeholder="选择日期">
                  </el-date-picker>
                </el-form-item>

                <el-form-item label="里程" prop="mileage">
                  <el-input v-model="car.mileage" auto-complete="off"></el-input>
                </el-form-item>

                <el-form-item label="超值">
                  <el-radio-group v-model="car.costeffective">
                    <el-radio class="radio" :label="1">是</el-radio>
                    <el-radio class="radio" :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="急售">
                  <el-radio-group v-model="car.rushsale">
                    <el-radio class="radio" :label="1">是</el-radio>
                    <el-radio class="radio" :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="准新车">
                  <el-radio-group v-model="car.quasinewcar">
                    <el-radio class="radio" :label="1">是</el-radio>
                    <el-radio class="radio" :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item label="全国可迁">
                  <el-radio-group v-model="car.transitivecountry">
                    <el-radio class="radio" :label="1">是</el-radio>
                    <el-radio class="radio" :label="0">否</el-radio>
                  </el-radio-group>
                </el-form-item>

                <el-form-item label="基本信息">
                  <quill-editor v-model="car.carDetail.info" :options="quillOption">
                  </quill-editor>
                </el-form-item>
              </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click.native="auditFormVisible = false">取消</el-button>
                <el-button type="primary" @click.native="rejected" :loading="auditLoading">驳回</el-button>
                <el-button type="primary" @click.native="pass" :loading="auditLoading">通过</el-button>
            </div>
        </el-dialog>
      <!--检测维护-->
      <el-dialog title="检测报告" :visible.sync="carDetectFormVisible" :close-on-click-modal="false">
        <el-form :model="cardetail" label-width="100px" ref="carDetectForm">

          <el-form-item label="检测员" prop="detectorname">
            <el-input v-model="cardetail.detectorname"></el-input>
          </el-form-item>
          <el-form-item label="事故图片" prop="accidentInvestigation">
            <el-upload
                class="upload-demo"
                action="http://localhost:80/fastDfs/"
                :on-preview="carDetectPreview"
                :on-remove="carDetectRemove"
                :on-success="carDetectSuccess"
                :file-list="carDetectFileList"
                list-type="picture">
              <el-button size="small" type="primary">点击上传</el-button>
              <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
            </el-upload>
          </el-form-item>
          <el-form-item label="标题" prop="cartitle">
            <el-input v-model="cardetail.cartitle" auto-complete="off"></el-input>
          </el-form-item>
          <el-form-item label="基本信息" prop="info">
            <quill-editor v-model="cardetail.info" :options="quillOption">
            </quill-editor>
          </el-form-item>
          <el-form-item label="检测时间" prop="detectiontime">
            <el-date-picker
                value-format="yyyy-MM-dd"
                v-model="cardetail.detectiontime"
                type="date"
                placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
          <el-form-item label="核心部件检测" prop="coreComponentsInvestigation">
            <el-tooltip content="检测结果">
              <el-radio-group v-model="cardetail.coreComponentsInvestigation">
                <el-radio class="radio" :label="'1'">合格</el-radio>
                <el-radio class="radio" :label="'0'">不合格</el-radio>
              </el-radio-group>
            </el-tooltip>
          </el-form-item>

          <el-form-item label="常用功能检测" prop="commonFunctionsInvestigation">
            <el-radio-group v-model="cardetail.commonFunctionsInvestigation">
              <el-radio class="radio" :label="'1'">合格</el-radio>
              <el-radio class="radio" :label="'0'">不合格</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="外观内饰检测" prop="appearanceInspection">
            <el-radio-group v-model="cardetail.appearanceInspection">
              <el-radio class="radio" :label="'1'">合格</el-radio>
              <el-radio class="radio" :label="'0'">不合格</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click.native="carDetectFormVisible = false">取消</el-button>
          <el-button type="primary" @click.native="detectSubmit" :loading="carDetectLoading">提交</el-button>
        </div>
      </el-dialog>

    </section>
</template>
<script>
    import { quillEditor } from "vue-quill-editor"; //调用编辑器
    import 'quill/dist/quill.core.css';
    import 'quill/dist/quill.snow.css';
    import 'quill/dist/quill.bubble.css';
    import quillConfig from  "../../common/js/quill-config.js"; //调用编辑器
    export default {
        components: {
          quillEditor
        },
        data() {
            return {
                quillOption:quillConfig,
                //分页相关
                query: {
                    currentPage: 1,
                    pageSize: 10,
                    keyword: ''
                },
                pageInfo: {
                    total: 0,
                    rows: []
                },
                listLoading: false,
                sels: [],//列表选中列
                carResourceFormVisible: false,//新增界面是否显示
                carDetectFormVisible: false,
                carResourceLoading: false,
                carDetectLoading: false,

                carFormVisible: false,//新增界面是否显示
                carLoading: false,
                carFormRules: {
                    key: [
                        {required: true, message: '请输入键', trigger: 'blur'}
                    ],
                    value: [
                        {required: true, message: '请输入值', trigger: 'blur'}
                    ]
                },

                auditFormVisible: false,//新增界面是否显示
                auditLoading: false,
                auditFormRules: {
                    key: [
                        {required: true, message: '请输入键', trigger: 'blur'}
                    ],
                    value: [
                        {required: true, message: '请输入值', trigger: 'blur'}
                    ]
                },
                //新增界面数据
                car: {
                    id: null,
                    title: '',
                    cover: '',
                    saleprice: '',
                    costprice: null,
                    isnew: 0,
                    reigstertime: '',
                    mileage: '',
                    costeffective: 0,
                    rushsale: 0,
                    quasinewcar: 0,
                    transitivecountry: 0,
                    carType: [],
                    carDetail: {
                        info: ''
                    }
                },
              //检测报告界面数据
              cardetail: {
                id: null,
                info: '',
                detectiontime: '',
                detectorname: '',
                cartitle: '',
                accidentInvestigation: '',
                coreComponentsInvestigation: '1',
                commonFunctionsInvestigation: '1',
                appearanceInspection: '1'
              },
                carTypes: [],
                fileList: [],
                carResourceImgFileList: [],
                carResourceViceImgFileList: [],
                carResourceMoreImgFileList: [],
                carDetectFileList: [],
                carResource:{
                    carId:null,
                    img:'',
                    viceimg:'',
                    moreimg:''
                }
            }
        },
        methods: {
          submitCheck(index,row){
            this.$http.put("/car/reqcheck/"+row.id).then(result => {
              if (result.data.success){
                this.$message({
                  message: '申请成功，请耐心等待...',
                  type: 'success'
                });
              }else{
                this.$message({
                  message: result.data.message,
                  type: 'error'
                });
              }
              this.getCars();
            });
          },
          onsale(){
            var ids = this.sels.map(item => item.id);
            //获取选中的行
            if(!this.sels || this.sels.length  <1){
              this.$message({ message: '老铁，你不选中数据，臣妾上架不了啊....',type: 'error'});
              return;
            }
            this.$confirm('确认上架选中记录吗？', '提示', {
              type: 'warning'
            }).then(() => {
              this.listLoading = true;
              this.$http.post('/car/onsale',ids).then((res) => {
                // this.listLoading = false;
                if(res.data.success){
                  this.$message({
                    message: '上架成功',
                    type: 'success'
                  });
                }else{
                  this.$message({
                    message: res.data.message,
                    type: 'error'
                  });
                }
                this.getCars();
              });
            }).catch(() => {

            });
          },
          offsale(){
            var ids = this.sels.map(item => item.id);
            //获取选中的行
            if(!this.sels || this.sels.length  <1){
              this.$message({ message: '老铁，你不选中数据，臣妾下架不了啊....',type: 'error'});
              return;
            }
            this.$confirm('确认下架选中记录吗？', '提示', {
              type: 'warning'
            }).then(() => {
              this.listLoading = true;
              this.$http.post('/car/offsale',ids).then((res) => {
                this.listLoading = false;

                if(res.data.success){
                  this.$message({
                    message: '下架成功',
                    type: 'success'
                  });
                }else{
                  this.$message({
                    message: res.data.message,
                    type: 'error'
                  });
                }
                this.getCars();
              });
            }).catch(() => {

            });
          },
          detectSubmit(){
            this.carDetectLoading = true;
            this.$http.put("/carDetail", this.cardetail).then((result) => {
              result = result.data;
              if(result.success){
                this.$message({
                  message: '保存成功',
                  type: 'success'
                });
                this.carDetectFormVisible = false; //关闭对话框
                this.$refs['carDetectForm'].resetFields(); //重置表单
              } else {
                this.$message({
                  message: '保存失败,' + res.message,
                  type: 'error'
                });
              }
              this.carDetectLoading = false;//关闭加载条
            });
            // console.log(this.cardetail);
          },
            resourceSubmit(){
                this.carResourceLoading = true;
                this.$http.put("/carResources", this.carResource).then((res) => {
                    res = res.data;
                    if (res.success) {
                        this.$message({
                            message: '保存成功',
                            type: 'success'
                        });
                        this.carResourceFormVisible = false; //关闭对话框
                        this.$refs['carResourceForm'].resetFields(); //重置表单
                    } else {
                        this.$message({
                            message: '保存失败,' + res.message,
                            type: 'error'
                        });
                    }
                    this.carResourceLoading = false;//关闭加载条
                });
            },
          //文件上传成功回调
          carDetectSuccess(response, file, fileList) {
            if (response.success) {
              let imgUrl = '';
              if(fileList&&fileList.length>0){
                for (let i = 0; i < fileList.length ; i++) {
                  if (i==(fileList.length-1)){
                    imgUrl = imgUrl+fileList[i].response.data;
                  }else{
                    imgUrl = imgUrl+fileList[i].response.data+",";
                  }
                }
                console.log(imgUrl)
                this.cardetail.accidentInvestigation=imgUrl;
              }
            }
          },
          //图片预览
          carDetectPreview(file) {
            console.log(file);
          },
          //文件删除
          carDetectRemove(file, fileList) {
            var filePath = file.response.data; //http://115.159.217.249:8888/group1/M00/00/00/rBEAA2MVmliAWdWWAACLuUIEKsg899.jpg
            this.$http.delete("/fastDfs/?path=" + filePath) //非restfull风格
                .then(res => {
                  if (res.data.success) {
                    this.$message({
                      message: '删除成功!',
                      type: 'success'
                    });
                  } else {
                    this.$message({
                      message: '删除失败!',
                      type: 'error'
                    });
                  }
                })
          },
            //文件上传成功回调
            carResourceImgHandleSuccess(response, file, fileList) {
                if (response.success) {
                    let imgUrl = '';
                    if(fileList&&fileList.length>0){
                        for (let i = 0; i < fileList.length ; i++) {
                            if (i==(fileList.length-1)){
                                imgUrl = imgUrl+fileList[i].response.data;
                            }else{
                                imgUrl = imgUrl+fileList[i].response.data+",";
                            }
                        }
                        console.log(imgUrl)
                        this.carResource.img=imgUrl;
                    }
                }
            },
            //文件删除
            carResourceImgHandleRemove(file, fileList) {
                var filePath = file.response.data; //http://115.159.217.249:8888/group1/M00/00/00/rBEAA2MVmliAWdWWAACLuUIEKsg899.jpg
                this.$http.delete("/fastDfs/?path=" + filePath) //非restfull风格
                    .then(res => {
                        if (res.data.success) {
                            this.$message({
                                message: '删除成功!',
                                type: 'success'
                            });
                        } else {
                            this.$message({
                                message: '删除失败!',
                                type: 'error'
                            });
                        }
                      this.carResourceImgFileList = [];
                    })
            },
            //图片预览
            carResourceImgHandlePreview(file) {
                console.log(file);
            },
            //文件上传成功回调
            carResourceMoreImgHandleSuccess(response, file, fileList) {
                if (response.success) {
                    let imgUrl = '';
                    if(fileList&&fileList.length>0){
                        for (let i = 0; i < fileList.length ; i++) {
                            if (i==(fileList.length-1)){
                                imgUrl = imgUrl+fileList[i].response.data;
                            }else{
                                imgUrl = imgUrl+fileList[i].response.data+",";
                            }
                        }
                        console.log(imgUrl)
                        this.carResource.moreimg=imgUrl;
                    }
                }
            },
            //文件删除
            carResourceMoreImgHandleRemove(file, fileList) {
                var filePath = file.response.data; //http://115.159.217.249:8888/group1/M00/00/00/rBEAA2MVmliAWdWWAACLuUIEKsg899.jpg
                this.$http.delete("/fastDfs/?path=" + filePath) //非restfull风格
                    .then(res => {
                        if (res.data.success) {
                            this.$message({
                                message: '删除成功!',
                                type: 'success'
                            });
                        } else {
                            this.$message({
                                message: '删除失败!',
                                type: 'error'
                            });
                        }
                    })
            },
            //图片预览
            carResourceMoreImgHandlePreview(file) {
                console.log(file);
            },
            //文件上传成功回调
            carResourceViceImgHandleSuccess(response, file, fileList) {
                if (response.success) {
                    let imgUrl = '';
                    if(fileList&&fileList.length>0){
                        for (let i = 0; i < fileList.length ; i++) {
                            if (i==(fileList.length-1)){
                                imgUrl = imgUrl+fileList[i].response.data;
                            }else{
                                imgUrl = imgUrl+fileList[i].response.data+",";
                            }
                        }
                        console.log(imgUrl)
                        this.carResource.viceimg=imgUrl;
                    }
                }
            },
            //图片预览
            carResourceViceImgHandlePreview(file) {
                console.log(file);
            },
            //文件删除
            carResourceViceImgHandleRemove(file, fileList) {
                var filePath = file.response.data; //http://115.159.217.249:8888/group1/M00/00/00/rBEAA2MVmliAWdWWAACLuUIEKsg899.jpg
                this.$http.delete("/fastDfs/?path=" + filePath) //非restfull风格
                    .then(res => {
                        if (res.data.success) {
                            this.$message({
                                message: '删除成功!',
                                type: 'success'
                            });
                        } else {
                            this.$message({
                                message: '删除失败!',
                                type: 'error'
                            });
                        }
                    })
            },
            //文件上传成功回调
            handleSuccess(response, file, fileList) {
                if (response.success) {
                    this.car.cover=response.data;
                }
            },
            //文件删除
            handleRemove(file, fileList) {
                var filePath = file.response.data; //http://115.159.217.249:8888/group1/M00/00/00/rBEAA2MVmliAWdWWAACLuUIEKsg899.jpg
                this.$http.delete("/fastDfs/?path=" + filePath) //非restfull风格
                    .then(res => {
                        if (res.data.success) {
                            this.$message({
                                message: '删除成功!',
                                type: 'success'
                            });
                        } else {
                            this.$message({
                                message: '删除失败!',
                                type: 'error'
                            });
                        }
                    })
            },
            //图片预览
            handlePreview(file) {
                console.log(file);
            },
            getTreeData() {
                // 发送一个异步请求: get请求 /product/carType/treeData
                this.$http.get("/carType/tree").then(res => {
                    this.carTypes = res.data.data;
                });
            },
            rejected() {
                this.$refs.auditForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认驳回吗？', '提示', {}).then(() => {
                            this.auditLoading = true;
                            let para = {
                              "id": this.car.id,
                              "auditstate": -1
                            };
                            this.$http.put("/car/rejected", para).then((res) => {
                                res = res.data;
                                if (res.success) {
                                    this.$message({
                                        message: '保存成功',
                                        type: 'success'
                                    });
                                    this.auditFormVisible = false; //关闭对话框
                                    this.$refs['auditForm'].resetFields(); //重置表单
                                } else {
                                    this.$message({
                                        message: '保存失败,' + res.message,
                                        type: 'error'
                                    });
                                }
                              this.getCars(); //重新加载数据
                                this.auditLoading = false;//关闭加载条
                            });
                        });
                    }
                });
            },
            pass() {
                this.$refs.auditForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认通过吗？', '提示', {}).then(() => {
                            this.auditLoading = true;
                            let para = {
                              "id": this.car.id,
                              "auditstate": 1
                            };
                            this.$http.put("/car/pass", para).then((res) => {
                                res = res.data;
                                if (res.success) {
                                    this.$message({
                                        message: '审核成功',
                                        type: 'success'
                                    });
                                    this.auditFormVisible = false; //关闭对话框
                                    this.$refs['auditForm'].resetFields(); //重置表单
                                } else {
                                    this.$message({
                                        message: '审核失败,' + res.message,
                                        type: 'error'
                                    });
                                }
                                this.getCars(); //重新加载数据
                                this.auditLoading = false;//关闭加载条
                            });
                        });
                    }
                });
            },
            autoAudit(index, row) {
              // this.auditFormVisible = true;
              console.log(row);
              this.$http.post("/car/autodetect", row).then(res => {
                if (res.data.success) {
                  this.$message({
                    message: '已审核!',
                    type: 'success'
                  });
                } else {
                  this.$message({
                    message: '审核出错!',
                    type: 'error'
                  });
                }
                this.getCars();
              });
            },
            handleAudit(index, row) {
                this.auditFormVisible = true;
              this.fileList = [];
              this.$http.get("/car/"+row.id).then(res => {
                console.log(res);
                this.car = res.data.data;

                if (this.car.cover!=null)
                  this.fileList = [{"url": this.car.cover}];
              });
              this.getTreeData();
            },
            getCarAdmins() {
                //发起请求获取数据
                this.$http.get("/employee")
                    .then(result => {
                        result = result.data; //{success,result:{}}
                        if (result.success) {
                            this.carAdmins = result.data;
                        } else {
                            this.$message({
                                message: '获取员工数据失败！' + result.message,
                                type: 'error'
                            });
                        }
                    })
                    .catch(result => {
                        this.$message({
                            message: '系统错误！',
                            type: 'error'
                        });
                    })
            },
            search() {
                this.query.currentPage = 1;
                this.getCars();
            },
            handleCurrentChange(val) {
                this.query.currentPage = val;
                this.getCars();
            },
            //获取用户列表
            getCars() {
                this.listLoading = true;//加载条，在发起请求之前让它显示出来
                //发起请求获得数据
                this.$http.post("/car", this.query)
                    .then(result => {
                        result = result.data;
                        if (result.success) {
                            this.pageInfo = result.data;
                        } else {
                            this.$message({
                                message: '获取失败' + result.message,
                                type: 'error'
                            })
                        }
                        this.listLoading = false;//关闭加载条
                    })
                    .catch(result => {
                        this.$message({
                            message: '系统错误',
                            type: 'error'
                        })
                    })
            },
            //删除
            handleDel: function (index, row) {
                this.$confirm('确认删除该记录吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listLoading = true;
                    //NProgress.start();
                    let para = row.id
                    console.log(para)
                    this.$http.delete('/car/' + para).then((res) => {
                        //NProgress.done();
                        res = res.data;
                        if (res.message) {
                            this.$message({
                                message: '删除成功',
                                type: 'success'
                            });
                            this.getCars();
                            this.listLoading = false;
                        } else {
                            this.$message({
                                message: '系统异常',
                                type: 'error'
                            });
                        }
                    }).catch(ref => {
                        this.$message({
                            message: '系统异常',
                            type: 'error'
                        });
                    })
                }).catch(() => {

                });
            },
            //显示编辑界面
            handleEdit: function (index, row) {
                this.carFormVisible = true;
                this.car = Object.assign({}, row);
                this.getCarAdmins();
            },
            //显示新增界面
            handleAdd: function () {
                this.carFormVisible = true;
                this.car = {
                    id: null,
                    title: '',
                    cover: '',
                    saleprice: '',
                    costprice: null,
                    isnew: 0,
                    reigstertime: '',
                    mileage: '',
                    costeffective: 0,
                    rushsale: 0,
                    quasinewcar: 0,
                    transitivecountry: 0,
                    carType: [],
                    carDetail: {
                        info: ''
                    }
                };
                this.getTreeData();
            },
          handleCardetect: function(index,row){
            this.carDetectFileList = [];
            // this.carResourceFormVisible = true;
            this.carDetectFormVisible = true;
            this.$http.get("/carDetail/"+row.id).then(res => {
              console.log(res);
              this.cardetail = res.data.data;
              if (this.cardetail.accidentInvestigation!=null)
                this.carDetectFileList = [{"url": this.cardetail.accidentInvestigation}];
            });
            // this.carDetectFormVisible = false;
          },

            handleCarResource: function (index,row) {
              this.carResource.carId = row.id;
              this.carResourceImgFileList = [];
              this.carResourceViceImgFileList = [];
              this.carResourceMoreImgFileList = [];
              this.carResourceFormVisible = true;

                //通过car_id 查询CarResource

                //分别来获取这三个值,并使用逗号来分隔，分别给这以下三个对象赋值
                // carResourceImgFileList: [{"url",xxx},{}],
                //carResourceViceImgFileList: [{src:"xxx}],
                //carResourceMoreImgFileList: [],
              if(this.carResourceImgFileList.length==0&&this.carResourceViceImgFileList.length==0&&this.carResourceMoreImgFileList.length==0){
                this.$http.get("/car/resources/"+row.id).then((result) => {
                  result = result.data;
                  console.log(result);
                  if(result.success){
                    this.carResource = {
                      carId: row.id,
                      img: result.data.img,
                      viceimg:result.data.viceimg,
                      moreimg:result.data.moreimg
                    };
                    this.carResourceImgFileList=[{"url": result.data.img}];
                    this.carResourceViceImgFileList=[{"url": result.data.viceimg}];
                    this.carResourceMoreImgFileList=[{"url": result.data.moreimg}];
                  }
                });
              }
            },
            //编辑
            save: function () {
                this.$refs.carForm.validate((valid) => {
                    if (valid) {
                        this.$confirm('确认提交吗？', '提示', {}).then(() => {
                            this.carLoading = true;
                            let para = Object.assign({}, this.car);

                            if(para.carType){// [2,7]
                                para.carType = {"id":para.carType[para.carType.length-1]}
                            }

                            console.log('提交参数', para)
                            this.$http.put("/car", para).then((res) => {
                                res = res.data;
                                if (res.success) {
                                    this.$message({
                                        message: '保存成功',
                                        type: 'success'
                                    });
                                    this.carFormVisible = false; //关闭对话框
                                    this.$refs['carForm'].resetFields(); //重置表单
                                    this.getCars(); //重新加载数据
                                } else {
                                    this.$message({
                                        message: '保存失败,' + res.message,
                                        type: 'error'
                                    });
                                }
                                this.carLoading = false;//关闭加载条
                            });
                        });
                    }
                });
            },
            selsChange: function (sels) {
                this.sels = sels;
            },
            //批量删除
            batchRemove: function () {
                var ids = this.sels.map(item => item.id);
                console.log(ids)
                this.$confirm('确认删除选中记录吗？', '提示', {
                    type: 'warning'
                }).then(() => {
                    this.listLoading = true;
                    // NProgress.start();
                    this.$http.patch("/car/batch", ids).then((res) => {
                        res = res.data;
                        if (res.message) {
                            this.$message({
                                message: '删除成功',
                                type: 'success'
                            });
                            this.getCars();
                            this.listLoading = false;
                        } else {
                            this.$message({
                                message: '系统异常',
                                type: 'error'
                            });
                        }
                    }).catch(ref => {
                        this.$message({
                            message: '系统异常',
                            type: 'error'
                        });
                    })
                }).catch(() => {

                });
            }
        },
        mounted() {
            this.getCars();
        }
    }

</script>

<style scoped>

</style>
